<template>
	<view class="tabTwo">
		<view class="tabTwoTop">
			<smh-nav :list="list" :current="defaultindex" @change="switchs"></smh-nav>
		</view>
		<view class="tabTwoShop">
			<view class="tabTwoShopFor" v-for="(item,key) in shop" :key="key"
				@click.stop="getnav('/pages/orderDetails/orderDetails',item.id)">
				<view class="tabTwoShopForOne">
					<view class="tabTwoShopForOneLeft">
						<text v-if="item.shop">{{item.shop.name || "名称"}}</text>
						<text v-else>店铺名称</text>
						<image src="https://www.kmdj2018.com/Uploads/zfb/right.png" mode="aspectFit"></image>
					</view>
					<view class="tabTwoShopForOneRight">
						<!-- <text class="tabTwoShopForOneRight_text" v-if="item.status == 1&&item.statustwo==3"
							@click.stop="getht(item)">
							签署合同
						</text>
						<text v-else>{{getorder(item.status)}}</text> -->
						<text>{{getorder(item.status)}}</text>
					</view>
				</view>
				<view class="tabTwoShopForTwo">
					<view class="tabTwoShopForTwoLeft">
						<image :src="item.goods.img" mode="aspectFill"></image>
					</view>
					<view class="tabTwoShopForTwoRight">
						<view class="tabTwoShopForTwoRightTone">
							{{item.goods.name}}
						</view>
						<view class="tabTwoShopForTwoRightTtwo" v-if="item.statustwo == 1">
							租期：{{item.goods.zuday}}天
						</view>
						<view class="tabTwoShopForTwoRightTtwo" v-if="item.statustwo == 2">

						</view>
						<view class="tabTwoShopForTwoRightTtwo" v-if="item.statustwo == 3">
							租期：{{item.periods}}期
						</view>
						<view class="tabTwoShopForTwoRightTtwo">
							x{{item.num}}
						</view>
					</view>
				</view>
				<view class="tabTwoShopForThree" style="display: flex;justify-content: flex-end;align-items: center;margin-top: 20rpx;">
					<view class="" style="width: 150rpx;margin-right: 30rpx;" @click.stop="getht(item)">
						<u-button color="#1152D2" >合同签署</u-button>
					</view>
					<view class="">
						总租金：
						<text>￥{{item.price}}</text>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [{
						name: "全部",
						id: ''
					},
					{
						name: "审核中",
						id: 8
					},
					{
						name: "待支付",
						id: 1
					},
					{
						name: "待发货",
						id: 2
					},
					{
						name: "使用中",
						id: 3
					},
					{
						name: "订单结束",
						id: 7
					},
					/* {
						name: "已取消",
						id: -1
					} */
				],
				defaultindex: 0, //默认让下标为1的数据选中，下标从0开始
				status: '',
				shop: [],
			};
		},
		onShow() {
			this.init()
		},
		methods: {
			getht(item) {
				uni.navigateTo({
					url: '/pages/tab/contract/contract'
				})
				// console.log(111);
				// let url = ''
				// uni.chooseImage({
				// 	count: 1,
				// 	sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
				// 	sourceType: ['album'], //从相册选择
				// 	success: (res) => {
				// 		url = res.tempFiles[0].path
				// 		this.uploadPhoto(url, item)
				// 	},
				// });
				/* 
				Order/ElectronicsOrder 签署电子合同，order_id  订单ID,  url  合同上传路径(每次都重新上传), 
				 */
			},
			uploadPhoto(url, item) {
				uni.getFileSystemManager().readFile({
					filePath: url, //选择图片返回的相对路径
					encoding: 'base64', //编码格式
					success: res => { //成功的回调
						let base64 = 'data:image/jpeg;base64,' + res.data //不加上这串字符，在页面无法显示的哦
						this.$request("Home/upload", {
							data: {
								img: base64
							},
							isLoad: false
						}).then(res => {
							// res.result
							this.$request("Order/ElectronicsOrder", {
								data: {
									order_id: item.id,
									url: res.result,
								},
								isLoad: false
							}).then(res => {
								uni.chooseImage({
									count: 1,
									sourceType: ['album'], //从相册选择
									success: (chooseImageRes) => {
										const tempFilePaths = chooseImageRes
											.tempFilePaths;
										let data = []
										data.push({
											name: 'file',
											file: tempFilePaths[0],
											uri: tempFilePaths[0]
										})
										console.log(tempFilePaths);
										this.$request("Baofile/ContractFileAdd", {
											data: {
												order_id: item.id,
												templateId: restemplateId.templateId,
											},
											isLoad: false
										}).then(res => {
											
										})
										// 注释掉的
										// this.$request("Baofile/TemplateCreate", {
										// 	data: {
										// 	},
										// 	isLoad: false
										// }).then(restemplateId => {
											 
										// })
										
										
										// Baofile/TemplateCreate
										/* uni.uploadFile({
											url: 'https://zuke.guochong.vip/Index/Baofile/GetFileLink', //仅为示例，非真实的接口地址 
											filePath: tempFilePaths[0],
											fileType: "image", //支付宝小程序必填
											name: 'file',
											success: (uploadFileRes) => {
												let shuju = JSON.parse(uploadFileRes.data)
												console.log(shuju,'酷酷酷酷酷酷酷酷酷');
												this.$request("Baofile/FieldOrder", {
													data: {
														order_id: item.id,
														fieldid: shuju.fieldid,
													},
													isLoad: false
												}).then(res => {
													
												})
											},
											fail: (err) => {
												console.log("69--",
													err);
											}
										}) */
									}
								});
							})
						})
					},
					fail: (e) => {
						console.log("图片转换失败", e);
					}
				})
			},
			switchs(e) {
				console.log(e)
				let index = e.index //下标
				this.defaultindex = index
				this.status = e.id //id
				this.init()
			},
			init() {
				this.$request("Order/OrderList", {
					data: {
						status: this.status
					},
					isLoad: false
				}).then(res => {
					this.shop = res.result
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.tabTwo {}

	.tabTwoShop {
		margin-top: 100rpx;
		padding: 20rpx 32rpx 0 32rpx;

		.tabTwoShopFor {
			background-color: #fff;
			border-radius: 20rpx;
			margin-bottom: 20rpx;

			.tabTwoShopForOne {
				display: flex;
				align-items: center;
				justify-content: space-between;
				padding: 32rpx 40rpx;

				.tabTwoShopForOneLeft {
					display: flex;
					align-items: center;

					text {
						max-width: 350rpx;
						overflow: hidden;
						display: -webkit-box;
						-webkit-box-orient: vertical;
						-webkit-line-clamp: 1;
					}

					image {
						width: 48rpx;
						height: 48rpx;
					}
				}

				.tabTwoShopForOneRight {
					font-size: 28rpx;
				}
			}

			.tabTwoShopForTwo {
				padding: 0 40rpx;
				display: flex;

				.tabTwoShopForTwoLeft {
					margin-right: 32rpx;

					image {
						width: 160rpx;
						height: 160rpx;
						// border: 1rpx solid red;
						border-radius: 16rpx;
					}
				}

				.tabTwoShopForTwoRight {
					.tabTwoShopForTwoRightTone {
						font-size: #323233;
						font-size: 32rpx;
						line-height: 45rpx;
						font-weight: bold;
						padding: 16rpx 0 0 0;
						overflow: hidden;
						text-overflow: ellipsis;
						display: -webkit-box;
						word-break: break-all;
						-webkit-box-orient: vertical;
						-webkit-line-clamp: 2;
					}

					.tabTwoShopForTwoRightTtwo {
						color: #323233;
						font-size: 24rpx;
						padding: 8rpx 0;
					}
				}
			}

			.tabTwoShopForThree {
				text-align: right;
				padding: 0 40rpx 32rpx 0;

				text {
					font-size: 40rpx;
					color: #F23D0E;
					font-weight: bold;
				}
			}
		}
	}

	.tabTwoTop {
		width: 100%;
		position: fixed;
		left: 0;
		top: 0;
		z-index: 999;
	}

	.tabTwoShopForOneRight_text {
		display: inline-block;
		// border: 1rpx solid red;
		padding: 7rpx 13rpx;
		border-radius: 50rpx;
		background-color: #F7BC1C;
		color: #fff;
	}
</style>
